import React, { useState, useEffect, useRef, useMemo, useCallback } from 'react'
import { Carousel, WingBlank, Toast } from 'antd-mobile';
import './cooperationDetails.scss'
import URI from 'urijs'
import lovelornUser from 'api/lovelorn-user'
import { useLoginContext } from 'modules/user/LoginContext';
import { withThirdLoginData } from 'modules/mall/components/thirdLoginData';
import { getWxCode } from 'utils/wxAuthorization';
import DetailsModel from 'modules/cooperationDetails/details/details';
import RegisterModal from 'modules/cooperationDetails/register/register';



const DetailsPage: PageComponent = props => {  
    const loginContext = useLoginContext() 
    const hasCodeFlag = useRef(false)
    const hasPustCodeFlag = useRef(false)
    const [showModal, setShowModal] = useState(false)
	const [showDetail, setShowDetail] = useState(false)
	
	var phoneNum = useRef(null)
    
	useEffect(() => {
		document.title = "合作明细"
		hasCodeFlag.current = false
		hasPustCodeFlag.current = false
	}) 
    // useEffect(() => {
	// 	// 获取 临时 code
	// 	if (window.location.href.indexOf('code') > -1) {
	// 		let query: any = URI(window.location.href).query(true);
	// 		if (hasPustCodeFlag.current) {
	// 			return
	// 		} else {
	// 			hasPustCodeFlag.current = true
	// 			var vcode = window.localStorage.getItem('vcode')
	// 			if (!!vcode && (vcode == query.code)) {
	// 				return
	// 			}
	// 		}
	// 		lovelornUser.userThirdLogins.checkLoginWxWeb({ code: query.code }).then(res => {
	// 			if (!res) return
	// 			window.localStorage.setItem('vcode', query.code)
	// 			loginContext.login(res.loginVO)
    //             withThirdLoginData.setShareState(res)
	// 		})
	// 	} else {
	// 		if (!hasCodeFlag.current) {
	// 			getWxCode(window.location.href,'wxc490fac4d58f86ef')
	// 			hasCodeFlag.current = true
	// 		}
	// 	}
    // }, []) 
    
    // useEffect(() => {
	// 	let thirdLoginData = withThirdLoginData.getShareState()
	// 	if (loginContext.state.isLogin && thirdLoginData.binding) {
    //         setShowModal(false)
    //         setShowDetail(true);
	// 	}else{
    //         setShowModal(true)
    //         setShowDetail(false);
    //     }
	// }, [loginContext.state.isLogin])
	useEffect(() => {
		console.log("loginContext",loginContext)
		if (loginContext.state.isLogin){
			setShowModal(false)
			setShowDetail(true);
		}else{
			setShowModal(true)
        	setShowDetail(false);
		}
    }, [])
    
    const registerSuccess = () => {
		setShowModal(false);
		setShowDetail(true);
	}
    return (
        <div className="details-page">
            {
                showDetail&&<DetailsModel phone={phoneNum.current}></DetailsModel>
            }
            {
                showModal&&<RegisterModal registerSuccess={registerSuccess} />
            }

        </div>
    )
}
export default DetailsPage